<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head lang="en" th:replace="include/common/common :: commonHeader">
    <footer th:include="include/common/common :: layUiResource"></footer>
    <footer th:include="include/common/common :: blueCSSResource"></footer>
    <footer th:include="include/common/common :: zTreeCSSSource"></footer>
    <footer th:include="include/common/common :: zTreeJSSource"></footer>
    <script>
        layui.config({
            base: '/staticResource/layuiadmin/' //静态资源所在路径
        }).extend({
            index: 'lib/index' //主入口模块
        }).use(['index','form','laydate'] , function () {
            var admin = layui.admin
                ,element = layui.element
                ,laydate = layui.laydate
                ,form = layui.form;

            laydate.render({
                elem: '#date'
                ,done:function (value , date , endDate) {
                    _date = value;
                    message = "【" + signName + "】尊敬的${变量：会员姓名}： 兹定于" + _date + "于" + _place + "举行" + _content + "活动，望周知！";
                    $("#preview").text(message);
                }
            });

            element.render();

            let entityName = 'sms';
            let signName = $("#signName").val();
            let _date = "${变量：时间}",_place = "${变量：地点}",_content = "${变量：主题内容}";
            let message = "【" + signName + "】尊敬的${变量：会员姓名}： 兹定于" + _date + "于" + _place + "举行" + _content + "活动，望周知！";

            $("#place").blur(function () {
                _place = $(this).val();
                let message = "【" + signName + "】尊敬的${变量：会员姓名}： 兹定于" + _date + "于" + _place + "举行" + _content + "活动，望周知！";
                $("#preview").text(message);
            });

            $("#content").blur(function () {
                _content = $(this).val();
                let message = "【" + signName + "】尊敬的${变量：会员姓名}： 兹定于" + _date + "于" + _place + "举行" + _content + "活动，望周知！";
                $("#preview").text(message);
            });

            $(document).ready(function () {
                $.fn.blueJs.tools.formButtonItem(entityName);
            });

            form.on('select(templateCode)' , function (data) {
                let templateCode = data.value;
                if (templateCode == 'SMS_230675170'){
                    let inputList = $('input');
                    let textareaList = $('textarea');
                    $.each(inputList , function (i , v) {
                        $(v).removeAttr("onclick");
                        $(v).attr('readonly' , 'readonly');
                    });
                    $.each(textareaList , function (i , v) {
                        $(v).removeAttr("onclick");
                        $(v).attr('readonly' , 'readonly');
                    });

                    $("#preview").text("【城中城购物广场】尊敬的会员，您好！今天是您的生日，愿在这特殊的日子里，您每时每刻都充满欢乐，愿您今后的生活，幸福甜蜜。城中城购物广场携全体员工祝您生日快乐！");
                }else if (templateCode == 'SMS_230675173'){
                    let inputList = $('input');
                    let textareaList = $('textarea');
                    $.each(inputList , function (i , v) {
                        $(v).removeAttr("readonly");
                    });
                    $.each(textareaList , function (i , v) {
                        $(v).removeAttr("readonly");
                    });
                    $("#preview").attr('readonly');

                    $("#preview").text(message);
                }
            });

            form.on('submit(' + entityName + 'Save)',function () {
                let msg = $.fn.blueJs.tools.formSubmit(this)
                    ,type = 'saveMsg';
                //当你在iframe页面关闭自身时
                let index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                $.fn.blueJs.tools.active[type].call(this , msg , index);
                return false;
            });

            //点击事件监听
            $(document).on('click' , function (event) {
                let targetId = event.target.id;
                let cancelBtn = entityName + "CancelBtn";
                if (targetId == cancelBtn){
                    let index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                    parent.layer.close(index); //再执行关闭
                }
            });

        });


    </script>
</head>
<body>
<!--  zTree遮罩层 -->
<input type="hidden" id="zTreeOption" value=""/>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body">
                    <form class="layui-form" id="smsForm" th:object="${sms}" method="post" action="/a/member/sendBatchSms">
                        <input type="hidden" class="layui-input " autocomplete="off" lay-verify="required" placeholder="" id="signName" th:field="*{signName}">
                        <input type="hidden" class="layui-input " autocomplete="off" lay-verify="required" placeholder="" id="phones" th:field="*{phones}">
                        <div class="blue-form-unit">短信群发</div>

                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label " title=""><span class="blue-required ">*</span>短信模板：</label>
                                <div class="layui-input-block">
                                    <select name="templateCode" lay-filter="templateCode" id="templateCode">
                                        <option value="" selected=""></option>
                                        <option value="SMS_230675173">通用活动通知</option>
                                        <option value="SMS_230675170">生日祝福</option>
                                    </select>
                                </div>
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label " title=""><span class="blue-required hide">*</span>时间：</label>
                                <div class="layui-input-block">
                                    <input type="text" lay-verify="date" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input" id="date" th:field="*{date}">
                                </div>
                            </div>
                            <div class="layui-col-md6">
                                <label class="layui-form-label " title=""><span class="blue-required hide">*</span>地点：</label>
                                <div class="layui-input-block">
                                    <input type="text" class="layui-input" autocomplete="off" lay-verify="required" placeholder="" id="place" th:field="*{place}">
                                </div>
                            </div>

                        </div>

                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label " title=""><span class="blue-required hide">*</span>主题内容：</label>
                                <div class="layui-input-block">
                                    <textarea name="content" rows="4" maxlength="500" class="layui-textarea" id="content" th:text="*{content}"></textarea>
                                </div>
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <div class="layui-col-md12">
                                <label class="layui-form-label " title=""><span class="blue-required hide">*</span>短信预览：</label>
                                <div class="layui-input-block">
                                    <textarea rows="4" maxlength="500" class="layui-textarea" id="preview" readonly></textarea>
                                </div>
                            </div>
                        </div>

                        <!-- Form 按钮组-->
                        <div class="layui-form-item layui-layout-admin">
                            <div class="layui-input-block blue-form-button-item"></div>
                        </div>

                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>




